function SupplierGrid() {
}

SupplierGrid.prototype.performRetrieve = function(configuration, otherstuff) {
		var appService = new SupplierService();
		appService.retrievePaged(SupplierGrid.prototype.fillGrid, configuration.page, configuration.rows, configuration.sord, configuration.sidx, "x => true");
};

SupplierGrid.prototype.fillGrid = function(jsonData) {
		var thegrid = jQuery("#grid")[0];
		thegrid.addJSONData(jsonData);
};

SupplierGrid.prototype.gridConfiguration = {
		datatype: SupplierGrid.prototype.performRetrieve,
		colNames: ['SupplierId','Region','PostalCode','Phone','HomePage','Fax','Country','ContactTitle','ContactName','CompanyName','City','Address'],
		colModel: [
				{ name: 'SupplierId', index: 'SupplierId', width: 200, align: 'left' },
				{ name: 'Region', index: 'Region', width: 200, align: 'left' },
				{ name: 'PostalCode', index: 'PostalCode', width: 200, align: 'left' },
				{ name: 'Phone', index: 'Phone', width: 200, align: 'left' },
				{ name: 'HomePage', index: 'HomePage', width: 200, align: 'left' },
				{ name: 'Fax', index: 'Fax', width: 200, align: 'left' },
				{ name: 'Country', index: 'Country', width: 200, align: 'left' },
				{ name: 'ContactTitle', index: 'ContactTitle', width: 200, align: 'left' },
				{ name: 'ContactName', index: 'ContactName', width: 200, align: 'left' },
				{ name: 'CompanyName', index: 'CompanyName', width: 200, align: 'left' },
				{ name: 'City', index: 'City', width: 200, align: 'left' },
				{ name: 'Address', index: 'Address', width: 200, align: 'left' }
],
    caption: "SupplierId",
    gridview: true,
    rownumbers: true,
    rownumWidth: 40,
    scroll: 1,
    rowNum: 100,
    sortname: 'CreatedDate',
    pager: '#pager',
    sortorder: "asc",
    viewrecords: true,
    autowidth: true,
    height: '100%',
    jsonReader: { root: "GridData", page: "CurrentPage", total: "TotalPages", records: "TotalRecords", repeatitems: false, id: "0" }
};

SupplierGrid.prototype.SetupGrid = function(selector) {
    jQuery(selector).html('<table id="grid"></table><div id="pager"></div>');
    var grid = jQuery("#grid").jqGrid(this.gridConfiguration);
    grid.setGridHeight(outerLayout.panes.center.innerHeight() - 105);
};
